<template>
  <a-modal :open="open" width="1200px" title="附加项目" centered @cancel="onCancel">
    <div class="bg-secondary w-full p-4 rounded-md border border-solid border-primary mb-2">
      <div class="flex items-center mt-2">
        <LabelValue label="" :width="260" value-class="font-bold text-primary" :value="`${rowData?.mc}，${rowData?.gg}`" />
        <LabelValue label="单位" :width="260" :value="rowData?.dw" />
        <LabelValue label="单价" :width="260" :value="rowData?.dj" />
        <LabelValue label="状态" :width="260" :value="rowData?.yxzt === 1 ? '停用' : '有效'" />
      </div>
      <div class="flex items-center mt-2">
        <LabelValue label="项目类别" :width="260" :value="rowData?.lbmc" />
        <LabelValue label="执行科室" :width="260" :value="rowData?.ksmc" />
        <LabelValue label="项目编号" :width="260" :value="rowData?.bh" />
      </div>
    </div>
    <div>
      <BaseTable
        :loading="loading"
        column-code="000957"
        :height="300"
        :row-class-name="(record) => (record.isNew ? 'table-row-new' : '')"
        :data-source="tableData"
      >
        <template #bodyCell="{ column, record }">
          <template v-if="column.dataIndex === 'sfxm'">
            <EditCell title="药品名称">
              <SelectMedicine v-model:value="record.sfxm" :show-tag="false" :row-data="record" @select="onSelectMedicine($event, record)" />
            </EditCell>
          </template>
          <template v-if="column.dataIndex === 'yf'">
            <EditCell title="给药途径" :disabled="record.isChild">
              <SelectTable v-model:value="record.yf.fyff" :table-width="360" type="用法" @select="onSelectWays($event, record)" />
            </EditCell>
          </template>
          <template v-if="column.dataIndex === 'pl' && record.pl">
            <EditCell title="频次" :disabled="record.isChild">
              <SelectTable v-model:value="record.pl.pl" :table-width="360" type="频率" @select="onSelectFrequency($event, record)" />
            </EditCell>
          </template>
          <template v-if="column.dataIndex === 'jlsl'">
            <EditCell title="剂量">
              <BaseInput v-model:value="record.jlsl" v-input:float v-input-selection placeholder="请输入" :suffix="record.jldw" @blur="onCalc(record)" />
            </EditCell>
          </template>
          <template v-if="column.dataIndex === 'cfts'">
            <EditCell title="天数" :disabled="record.isChild">
              <BaseInput v-model:value="record.cfts" v-input:int v-input-selection suffix="天" placeholder="请输入" @blur="onCalc(record)" />
            </EditCell>
          </template>
          <template v-if="column.dataIndex === 'sl'">
            <EditCell title="总量">
              <BaseInput v-model:value="record.sl" v-input:int v-input-selection :suffix="record.sfxm?.dw" placeholder="请输入" @blur="onCalc(record)" />
            </EditCell>
          </template>
          <template v-if="column.dataIndex === 'yssm'">
            <EditCell title="医生说明">
              <a-input v-model:value="record.yssm" placeholder="请输入" />
            </EditCell>
          </template>
          <template v-if="column.dataIndex === 'action'">
            <BaseButton danger size="small" type="text" confirm-text="确认作废？" @click="onDelete(record)"> 作废 </BaseButton>
          </template>
        </template>
        <template #footer>
          <div class="text-center sticky bottom-0">
            <a-button class="mr-2" @click="addRow()"> 新增一行 </a-button>
            <a-button type="primary" @click="onSave()"> 保存 </a-button>
          </div>
        </template>
      </BaseTable>
    </div>
  </a-modal>
</template>
<script setup>
import { ref, watch } from 'vue'
import { message } from 'ant-design-vue'
import { post } from '@/utils/request'

const emit = defineEmits(['update:open', 'success'])
const props = defineProps({
  open: Boolean,
  rowData: {
    type: Object,
    default: () => ({})
  }
})

const onSave = async () => {
  const { code, msg } = await post('/common/masterData/saveDictAdviceAttachList ', tableData.value)
  if (code !== 0) return message.error(msg)
  message.success('保存成功')
  // getData()
  // emit('success')
  onCancel()
}
const tableData = ref([])
const getData = async () => {
  const { code, msg, data } = await post('/common/masterData/getDictAdviceAttachList', { parentId: props.rowData.bh })
  if (code !== 0) return message.error(msg)
  tableData.value = data
}

const onCancel = () => {
  emit('update:open', false)
}
const addRow = () => {
  tableData.value.push({
    bh: props.rowData.bh,
    yzzt: 0,
    yf: {},
    sfxm: {},
    pl: {},
    key: `row-key-${Math.random().toString().slice(2)}`,
    isNew: true
  })
}
//选药
const onSelectMedicine = (medicine, row) => {
  row.sfxm = medicine
  row.sl = 1
  row.jldw = medicine?.jldw
  onCalc(row)
}
//选频率
const onSelectFrequency = (selected, row) => {
  row.pl = selected
  onCalc(row)
}
const onCalc = async (row) => {
  if (!row.sl || !row.sfxm) return
  row.je = row.sl * row.sfxm.dj
}
//选用法
const onSelectWays = (selected, row) => {
  row.yf = selected
}
const onDelete = async (row) => {
  if (row.isNew) {
    const index = tableData.value.findIndex((item) => item.key === row.key)
    tableData.value.splice(index, 1)
    message.success('删除成功')
  } else {
    fetchDelete(row)
  }
}
const fetchDelete = async (row) => {
  const { code, msg } = await post('/common/masterData/delDictAdviceAttachList', row)
  if (code !== 0) return message.error(msg || '作废失败')
  message.success('作废成功')
  getData()
}
watch(
  () => props.open,
  (val) => {
    if (val) {
      getData()
    } else {
      tableData.value = []
    }
  }
)
</script>

<style lang="less" scoped>
.ant-tag-checkable-checked {
  color: #fff;
  background-color: var(--primary-color);
}
</style>
